.box {
  &-border {
    box-sizing: border-box;
  }

  &-content {
    box-sizing: content-box;
  }
}

.display {
  @at-root {
    .block {
      display: block;
    }
    .inline {
      display: inline;
    }
    .inline-block {
      display: inline-block;
    }
    .hidden {
      display: none;
    }
    .table {
      display: table;
    }
    .grid {
      display: grid;
    }
  }
}

.position {
  @at-root {
    .sticky {
      position: sticky;
    }
    .static {
      position: static;
    }
    .relative {
      position: relative;
    }
    .absolute {
      position: absolute;
    }
    .fixed {
      position: fixed;
    }
  }
}

.overflow {
  &-hidden {
    overflow: hidden;
  }
  &-auto {
    overflow: auto;
  }
  &-scroll {
    overflow: scroll;
  }
  &-visible {
    overflow: scroll;
  }
}
